
import React, { Component } from 'react';
// 导入注册页样式
import './Register.scss';


import { user_register } from '../utils/api';

class Register extends Component {
    constructor(props){
     super(props)
        this.state = {//初始化组件状态
        formData: {
            phone: '',
            pass: '',
            checkpass: ''
        }
    }

    }
    // 挂载期
    componentDidMount(){
       

               

          user_register({phone:'13611129070',pass:'1234'}).then((res)=>{
             console.log(res.data);
          })
    }
    register() {
        if (/^1[3-9]\d{9}$/.test(this.formData.phone) == false) {
            alert('请输入合法的手机号');
        } else if (!this.formData.pass || !this.formData.checkpass) {
            alert('请输入密码/确认密码')
        } else if (this.formData.pass !== this.formData.checkpass) {
            alert('密码和确认密码不一致');
        } else { //验证通过 
            //深拷贝formData
            var newFormData = JSON.parse(JSON.stringify(this.formData));
            //删除对象的checkpass属性
            delete newFormData.checkpass;

            //发起注册请求
            user_register(newFormData).then((res) => {
                if (res.data.code == 200) { //注册成功
                    alert('注册成功!')
                    //跳转到登录页
                    // this.$router.push('/login');
                } else {
                    alert(res.data.msg);
                }
            })
        }}

    render() {
        return (
            <div class="register">
                <div class="title">注册页</div>
                <div class="block">
                    <input type="text" v-model="formData.phone" placeholder="输入手机号"/>
                </div>
                <div class="block">
                    <input type="password" v-model="formData.pass" placeholder="输入密码"/>
                </div>
                <div class="block">
                    <input type="password" v-model="formData.checkpass" placeholder="输入确认密码"/>
                </div>
                <div class="block">
                    <input type="button" value="注册" onClick={()=>{
                        this.register();
                    }}/>
                </div>
            </div>
        );
    }
}

export default Register;